<template>
    <view style="height: 100%">
        <!-- components/activityPopup.wxml -->
        <!-- <van-overlay z-index="5" :show="successInvitation"> -->
            <u-overlay z-index="5" :show="successInvitation">
                <view class="wrapper_wrap">
                    <view class="wrapper">
                        <view class="block">
                            <image
                                style="width: 90%; height: 1000rpx; position: absolute; left: 40rpx"
                                src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/bg.png"
                            ></image>
                            <view class="couponShade">
                                <view class="zc_title" v-if="inviteTipDetail.type == 1" style="width: 88%; border-radius: 10rpx 10rpx 0rpx 0rpx">
                                    已成功邀请{{ inviteTipDetail.userCount }}人
                                </view>
                                <view class="zc_title yq_flex" v-if="inviteTipDetail.type == 2" style="width: 88%; border-radius: 10rpx 10rpx 0rpx 0rpx">
                                    您通过{{ inviteTipDetail.inviteUserName }}的邀请，完成
                                    <text v-if="inviteTipDetail.rewardRuleType == 1">注册</text>
                                    <text v-if="inviteTipDetail.rewardRuleType == 2">首次消费</text>
                                    <text v-if="inviteTipDetail.rewardRuleType == 3">首次充值</text>
                                </view>
                                <view class="xr_title">
                                    <image style="width: 63rpx; height: 9rpx" src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/decorate-1.png"></image>
                                    <view class="xr_text">恭喜获得</view>
                                    <image style="width: 63rpx; height: 9rpx" src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/decorate-2.png"></image>
                                </view>
                                <view class="popup_icon_list">
                                    <!-- <view class="popup_icon_item" v-if="inviteTipDetail.serviceFee">
                                        <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/Popup-icon1.png"></image>
                                        <view class="popup_icon_des">免服务费{{ inviteTipDetail.serviceFee }}次</view>
                                    </view> -->
                                    <view class="popup_icon_item" v-if="inviteTipDetail.bonus">
                                        <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/Popup-icon2.png"></image>
                                        <view class="popup_icon_des">奖励金{{ inviteTipDetail.bonus }}元</view>
                                    </view>
                                    <view class="popup_icon_item" v-if="inviteTipDetail.integral">
                                        <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/Popup-icon3.png"></image>
                                        <view class="popup_icon_des">积分{{ inviteTipDetail.integral }}分</view>
                                    </view>
                                </view>
                                <view class="coupon">
                                    <view class="coupon_title">
                                        <!-- 优惠券x{{ inviteTipDetail.couponList.length }}，价值{{ inviteTipDetail.couponAmount }}元 -->
                                        卡券
                                    </view>
                                    <scroll-view class="coupon_list2" :scroll-y="true">
                                        <view class="coupon_item" v-for="(item, index) in inviteTipDetail.couponVoList" :key="index">
                                            <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/Coupons-bg.png"></image>

                                            <view class="coupon_item_wrap">
                                                <view class="coupon_item_fl">
                                                    <view class="coupon_item_money">
                                                        <text class="text_num" v-if="item.couponName!='折扣券'">￥</text>
                                                        <text class="text_num2">{{ item.couponAmount }}</text>
                                                    </view>
                                                    <!-- <view class="coupon_item_type" v-if="item.type == 1">服务费券</view>
                                                    <view class="coupon_item_type" v-if="item.type == 2">电费券</view>
                                                    <view class="coupon_item_type" v-if="item.type == 3">现金券</view> -->
                                                </view>
                                                <view class="coupon_item_fr">
                                                    <!-- <view class="coupon_item_type" v-if="item.type == 1">服务费券</view>
                                                    <view class="coupon_item_type" v-if="item.type == 2">电费券</view>
                                                    <view class="coupon_item_type" v-if="item.type == 3">现金券</view> -->
                                                    <view class="coupon_item_type">
                                                        {{ item.couponName }}
                                                        <text v-if="item.number>1">X{{ item.number }}</text>
                                                    </view>
                                                    
                                                    <!-- <view class="coupon_item_des">满{{ item.meetAmount }}可用</view> -->
                                                    <view class="coupon_item_des">{{ item.couponUseSill }}</view>
                                                    <!-- <view class="coupon_item_time">
                                                        <image class="coupon_item_time_icon" src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/shi.png"></image>
                                                        {{ item.receiveTime }}
                                                    </view>
                                                    <view class="coupon_item_time">
                                                        <image class="coupon_item_time_icon" src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/zhi.png"></image>
                                                        {{ item.expireTime }}
                                                    </view> -->
                                                </view>
                                            </view>
                                        </view>
                                    </scroll-view>
                                </view>
                                <view class="coupon_btn" @tap="toYaoqing" v-if="inviteTipDetail.type == 1">
                                    <text>继续邀请</text>
                                </view>
                                <view class="coupon_btn" @tap="successInvitationClose" v-if="inviteTipDetail.type == 2">
                                    <text>知道了</text>
                                </view>
                            </view>

                            <image
                                style="width: 741rpx; height: 819rpx; position: absolute; top: -120rpx; left: -30rpx; z-index: -1"
                                src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/light.png"
                            ></image>
                            <image
                                @tap="successInvitationClose"
                                style="width: 44rpx; height: 44rpx; position: absolute; right: 30rpx; top: -60rpx"
                                src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/delete.png"
                            ></image>
                        </view>
                    </view>
                </view>
            </u-overlay>
            
        <!-- </van-overlay> -->
    </view>
</template>

<script lang="ts">
// import zpMixins from '@/uni_modules/zp-mixins/index';
// import vanOverlay from './@vant/weapp/overlay/index';
// components/activityPopup.ts
import { getInviteTip, inviteTipClose } from '../../api/marketing/popUpApi';
export default {
    components: {
        // vanOverlay
    },
    data() {
        return {
            //成功邀请专享好礼
            inviteTipDetail: {
                type: 0,
                userCount: '',
                rewardRuleType: 0,
                serviceFee: '',
                bonus: '',
                integral: '',
                couponList: '',
                couponAmount: ''
            },
            successInvitation: false
        };
    },
    /**
     * 组件的属性列表
     */
    props: {
        // yqMsg: {
        //   type: Object,
        //   value: {},
        // }
    },
    mounted() {
        // 处理小程序 attached 生命周期
        this.attached();
    },
    /**
     * 组件的方法列表
     */
    methods: {
        attached: function () {},

        //邀请奖励弹窗
        getInviteTips() {
            getInviteTip({
                plUserId: uni.getStorageSync('memberId')
            })
                .then((res: any) => {
                    console.log(res.data, '邀请奖励弹窗信息啊!!!!');
                    let successInvitation = false;
                    let inviteTipDetail = res.data || {};
                    // && res.data.rewardRuleType
                    if (res.data) {
                        successInvitation = true;
                    }
                    this.setData({
                        inviteTipDetail,
                        successInvitation
                    });
                    console.log(this.inviteTipDetail, '再次???邀请奖励详情弹窗11111');
                    console.log(this.successInvitation, '再次???邀请奖励详情弹窗状态22222');
                })
                .catch((err) => {
                    console.log(err);
                });
        },

        // 关闭成功邀请专享好礼弹窗
        successInvitationClose() {
            // .rewardRuleType
            if (this.inviteTipDetail) {
                inviteTipClose({}).then((res: any) => {
                    if (res.data) {
                        console.log('邀请详情信息弹窗关闭;');
                    }
                });
            }
            this.setData({
                successInvitation: false
            });
        },

        toYaoqing() {
            this.successInvitationClose();
            let marketingId = this.inviteTipDetail.id;
            console.log(marketingId, '跳转至邀请活动的id');
            uni.navigateTo({
                url: '/marketing_page/pages/invite/invitation/invitation?HD=' + marketingId
            });
        }
    },
    created: function () {
        if(uni.getStorageSync('memberId')){
            console.log('获取邀请奖励弹窗!!!')
           this.getInviteTips() 
        }
    }
};
</script>
<style lang="less">
@import '../../pages/index/home-popup.less';

.yq_flex {
    display: flex;
    justify-content: center;
}
</style>
